
<template>
  <div>
    <page :asideShow="asideShow">
      <div slot="toolbar">
        <el-form :inline="true" :model="filters" label-position="right">
          <el-form-item label="选择机构">
            <el-cascader
              @change="refreshPageRequest(1)"
              v-model="filters.GID"
              :options="organizeMix"
              :props="{
                multiple: false,
                value: 'GID',
                label: 'name',
                children: 'children',
                checkStrictly: true,
                emitPath: false
              }"
              :show-all-levels="false"
              clearable
            ></el-cascader>
          </el-form-item>
          <el-form-item>
            <el-button @click="handleQuery('a')">查询</el-button>
            <el-button type="primary" @click="handleAdd" v-show="hasPerm('commadmin:vote:add')">新增</el-button>
          </el-form-item>
        </el-form>
      </div>
      <!-- 内容区域 -->
      <div slot="content">
        <el-table
          :header-cell-style="{ background: '#e7eaf0', color: '#606266' }"
          :data="pageResult"
          stripe
          v-loading="loading"
          style="width: 100%"
          element-loading-text="加载中..."
        >
          <el-table-column prop="title" label="标题" align="center" width="200">
            <template slot-scope="scope">
              <span class="ellipsis">{{ scope.row.title }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="text" label="内容" align="center" width="200" show-overflow-tooltip>
            <template slot-scope="scope">
              <span class="ellipsis">{{ scope.row.text }}</span>
            </template>
          </el-table-column>
          <el-table-column prop="create_name" label="创建人" align="center"></el-table-column>
          <el-table-column prop="stopTime" label="截止日期" align="center">
            <template slot-scope="scope">
              {{ $format(scope.row.stopTime) }}
            </template>
          </el-table-column>
          <el-table-column prop="insertTime" label="创建时间" align="center">
            <template slot-scope="scope">
              {{ $format(scope.row.insertTime) }}
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            header-align="center"
            align="center"
            width="500"
            :label="$t('action.operation')"
          >
            <template slot-scope="scope">
              <el-button type="success" @click="showResult(scope.row)" v-show="hasPerm('commadmin:vote:result')">
                投票结果
              </el-button>
              <el-button type="primary" @click="handleEdit(scope.row)" v-show="hasPerm('commadmin:vote:edit')">
                查看编辑
              </el-button>
              <el-button type="info" @click="showcontent(scope.row)">投票内容</el-button>
              <el-button
                v-if="scope.row.isStop === 2"
                type="warning"
                @click="stopVotes(scope.row, 1)"
                v-show="hasPerm('commadmin:vote:open')"
              >
                已发布
              </el-button>
              <el-button
                v-else
                type="warning"
                @click="stopVotes(scope.row, 2)"
                v-show="hasPerm('commadmin:vote:stop')"
              >
                结果发布
              </el-button>
              <el-button type="danger" @click="handleDelete(scope.row)" v-show="hasPerm('commadmin:vote:remove')">
                删除投票
              </el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>

      <!-- 底部区域 -->
      <div slot="footer">
        <el-pagination
          layout="total, prev, pager, next, jumper"
          @current-change="refreshPageRequest"
          :current-page="pageRequest.page"
          :page-size="pageRequest.limit"
          :total="totalSize"
          style="float: right"
        ></el-pagination>
      </div>
    </page>
    <el-dialog class="dialog-container" title="修改" :visible.sync="editVisible" :modal-append-to-body="false">
      <editPage
        v-if="editVisible"
        :data="dataForm"
        @handleSave="handleSave"
        @closeEdit="closeEdit"
        @clickCancel="handleCancel"
      ></editPage>
    </el-dialog>
    <el-dialog class="dialog-container" title="新增" :visible.sync="addVisible" :modal-append-to-body="false">
      <addvote
        v-if="addVisible"
        @handleSave="handleSave"
        @closeEdit="closeEdit"
        @clickCancel="handleCancel"
      ></addvote>
    </el-dialog>
    <el-dialog
      class="dialog-container"
      title="调查结果"
      :visible.sync="isShowResult"
      :modal-append-to-body="false"
      :destroy-on-close="true"
      @close="closeEdit"
    >
      <result v-if="isShowResult" :data="dataForm"></result>
    </el-dialog>
    <el-dialog
      class="dialog-container"
      title="投票内容"
      :visible.sync="isShowVcontent"
      :modal-append-to-body="false"
      :destroy-on-close="true"
      @close="closeEdit"
    >
      <vcontent v-if="isShowVcontent" @handleSave="handleSave" :data="dataForm"></vcontent>
    </el-dialog>
  </div>
</template>

<script>
import editPage from './editor';
import addvote from './addvote';
import result from './showResult';
import vcontent from './votecontent.vue';
export default {
  components: {
    editPage,
    addvote,
    result,
    vcontent
  },
  data() {
    return {
      loading: true,
      //展示投票结果
      isShowResult: false,
      // 弹框
      dialogTableVisible: false,
      // 默认图片
      isShowVcontent: false,
      imgs: require('@/assets/imgs/houtai/wutu.png'),
      tableData: [],
      // 查询返回
      asideShow: false,
      unitShow: false,
      pageResult: [],
      getCommunity: [],
      filters: {
        CIDS: ''
      },
      pageRequest: {
        page: 1,
        limit: 10
      },
      columns: [],
      loading: false,
      totalSize: 0,
      exportUrl: this.global.baseUrl + '/self_test_stat/export',
      exportLoading: false,
      // 一户一档列表
      oneHouseList: [],
      operation: false, // true:新增, false:编辑
      // 新增编辑界面是否显示
      editVisible: false,
      addVisible: false,
      // 新增编辑界面数据
      dataForm: {
        text: '',
        name: '',
        title: ''
      }
    };
  },
  async mounted() {
    this.handleQuery();
    this.getCommunityList();
    this.organizeMix = await this.getOrganizeMix();
  },
  methods: {
    //展示投票结果
    showResult(row) {
      let objs = { ...row };
      delete objs.CIDS;
      this.dataForm = objs;
      console.log(this.dataForm);
      this.isShowResult = true;
    },
    //投票内容
    showcontent(row) {
      this.dataForm = JSON.parse(JSON.stringify(row));
      this.isShowVcontent = true;
    },
    //暂停投票
    stopVotes(e, zt) {
      let txt = '是否发布结果？';
      if (zt === 1) {
        txt = '是否发布结果？';
      }
      this.$confirm(txt, '提示', {}).then(() => {
        this.loading = true;
        let params = Object.assign({}, e);
        params.isStop = zt;
        this.$api.wxNotic.weixin_vote_add({ where: params }).then((res) => {
          this.loading = false;
          if (res.code == 0) {
            this.$message({
              message: '操作成功',
              type: 'success'
            });
            this.handleQuery();
          } else {
            this.$message({
              message: '操作失败, ' + res.msg,
              type: 'error'
            });
          }
        });
      });
    },
    // 查询列表
    handleQuery(val) {
      let param = {
        page: val ? '' : this.pageRequest.page,
        limit: val ? '' : this.pageRequest.limit,
        where: {
          status: 1
        }
      };
      let params = Object.assign(param, this.filters);
      let paramJson = JSON.stringify(params);
      this.loading = true;
      this.$api.wxNotic.weixin_vote_list(paramJson).then((res) => {
        if (res.code == 0) {
          this.loading = false;
          this.pageResult = res.data;
          this.totalSize = res.count;
        } else {
          this.$message({ message: '操作失败, ' + res.msg, type: 'error' });
        }
      });
    },
    //删除
    handleDelete(row) {
      this.$confirm('确认删除选中记录吗？', '提示', {
        type: 'warning'
      }).then(() => {
        let params = Object.assign({}, row);
        params.status = 2;
        this.$api.wxNotic.weixin_vote_add({ where: params }).then((res) => {
          this.editLoading = false;
          if (res.code == 0) {
            this.$message({
              message: '操作成功',
              type: 'success'
            });
            // this.$emit("handleEdit");
            this.handleQuery();
            // this.handleClose();
          } else {
            this.$message({
              message: '操作失败, ' + res.msg,
              type: 'error'
            });
          }
        });
      });
    },
    //获取小区的列表选择器
    getCommunityList() {
      let params = {};
      params = {
        where: {
          CODES: []
        }
      };
      let param = JSON.stringify(params);
      this.loading = true;
      this.$api.three.communityList(params).then((res) => {
        if (res.code == 0) {
          this.loading = false;
          this.getCommunity = res.data;
        } else {
          this.$message({ message: '操作失败, ' + res.msg, type: 'error' });
        }
      });
    },
    // 翻页
    refreshPageRequest(val) {
      this.pageRequest.page = val;
      this.handleQuery();
    },
    // 新增
    handleAdd() {
      this.addVisible = true;
      this.operation = true;
    },
    // 编辑
    handleEdit(row) {
      this.addVisible = false;
      this.editVisible = true;
      this.operation = false;
      this.dataForm = JSON.parse(JSON.stringify(row));
    },
    //添加切换到编辑
    changeEdit(row) {},
    handleSave: function () {
      this.editVisible = false;
      this.addVisible = false;
      this.isShowVcontent = false;
      this.handleQuery();
    },
    /* 保存成功关闭编辑弹窗 */
    closeEdit: function () {
      this.editVisible = false;
      this.isShowResult = false;
      this.addVisible = false;
    },
    /* 取消编辑 */
    handleCancel: function () {
      this.editVisible = false;
    }
  }
};
</script>

<style lang="scss" scoped>
.demo-table-expand {
  font-size: 0;
}
.demo-table-expand label {
  width: 90px;
  color: #99a9bf;
}
.demo-table-expand .el-form-item {
  margin-right: 0;
  margin-bottom: 0;
  width: 50%;
}
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 250px;
}
</style>
